<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加商品成功</title>
    <script src="/static/index/js/vue.js"></script>
    <script src="/static/index/js/moment.min.js"></script>
    <script src="/static/antd/dist/antd.js"></script>
    <link rel="stylesheet" href="/static/antd/dist/antd.css">
    <script src="/static/antd/dist/jquery.js"></script>
    <link rel="stylesheet" href="/static/antd/dist/myLogos.css">
    <link rel="stylesheet" href="/static/antd/dist/footer/style.css">
    <link rel="stylesheet" href="/static/antd/dist/footer/bootstrap.css">

    <style>
        .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
          vertical-align: middle!important;
        }
    </style>
</head>
<body>
<div id="app" style="min-width: 1332px;">
    <!-- 顶部 -->
    <div style="position: fixed; width: 100%; z-index: 999;top: 0;">
        <a-collapse>
            <a-collapse-panel style="font-size: 2rem; text-align: center" key="1"
                              th:header="${session.loginUser==null?'请登录':session.loginUser.nickname}">
                <a style="padding-left: 25px; color: cadetblue;" href="http://auth.shushan.com/login.html"
                   th:if="${session.loginUser==null}">登录</a>
                <div style="width: 50%; margin: 25px auto">
                    <a-button @click="cart" type="primary" style="width: 100%;">
                        购物车
                    </a-button>
                </div>
                <div style="width: 50%; margin: 0 auto">
                    <a-input-search
                            v-model="keywordInput"
                            placeholder="请输入关键字"
                            enter-button="搜索"
                            size="large"
                            @search="onSearch"></a-input-search>
                </div>
                <br/>
                {{keywordInput}}
            </a-collapse-panel>
        </a-collapse>
    </div>

    <!-- 中间添加成功消息 -->
    <div
        style="margin-top: 100px;
             margin-bottom: 50px;
              display: flex;
              justify-content: center;
               align-items: center;">
        <a-card
            hoverable
            style="width: 80%;"
        >
            <!--      style="width: 420px; height: 630px; display: flex; justify-content: center; align-items: center;"-->
            <table class="table" th:each="order : ${orders.page.list}">
              <a-card style="width: 100%; " hoverable>
                <tr>
                    <td colspan="7" style="background:#F7F7F7">
                      <a-card hoverable style="width: 100%;">
                        <span style="color:#AAAAAA"
                              th:text="${(order.modifyTime.replace('T', '&nbsp;')).replace('.000+0000','')}">2017-12-09 20:50:10</span>
                        <span><ruby style="color:#AAAAAA">订单号:</ruby> [[${order.orderSn}]]</span>
                        <span>书山<i class="table_i"></i></span>
                        <i class="table_i5 isShow"></i>
                      </a-card>
                    </td>
                </tr>
                <tr class="tr" th:each="item, itemStat : ${order.itemEntities}">
                  <a-card hoverable style="width: 100%;">
                    <td colspan="3" style="border-right: 1px solid #ccc; position: relative; top: 17px;">
                        <img style="width: 60px; height: 60px;" th:src="${item.skuPic}" alt="" class="img">
                        <div>
                            <p style="width: 242px; height: auto; overflow: auto">[[${item.skuName}]]</p>
                        </div>
                        <div style="margin-left:15px;">x[[${item.skuQuantity}]]</div>
                        <div style="clear:both"></div>
                    </td>
                    <td th:if="${itemStat.index == 0}" th:rowspan="${itemStat.size}">
                     <a-tag>[[${order.receiverName}]]</a-tag>
                    </td>
                    <td th:if="${itemStat.index == 0}" th:rowspan="${itemStat.size}"
                        style="padding-left:10px;color:#AAAAB1;">
                        <p style="margin-bottom:5px;">总额 <span style="color: red;">￥[[${order.payAmount}]]</span></p>
                        <hr style="width:90%;">
                        <p><a-tag> 在线支付</a-tag> </p>
                    </td>
                    <td th:if="${itemStat.index == 0}" th:rowspan="${itemStat.size}">
                        <ul>
                            <li style="color:#71B247;" th:if="${order.status==0}">待付款</li>
                            <li style="color:#71B247;" th:if="${order.status==1}">已付款</li>
                            <li style="color:#71B247;" th:if="${order.status==2}">已发货</li>
                            <li style="color:#71B247;" th:if="${order.status==3}">已完成</li>
                            <li style="color:#71B247;" th:if="${order.status==4}">已取消</li>
                            <li style="color:#71B247;" th:if="${order.status==5}">售后中</li>
                            <li style="color:#71B247;" th:if="${order.status==6}">售后完成</li>
                            <li style="margin:4px 0;" class="hide"><i class="table_i2"></i>跟踪<i class="table_i3"></i>
                                <div class="hi">
                                    <div class="p-tit">
                                        普通快递 运单号:390085324974
                                    </div>
                                    <div class="hideList">
                                        <ul>
                                            <li>
                                                [北京市] 在北京昌平区南口公司进行签收扫描,快件已被拍照(您
                                                的快件已签收,感谢您使用韵达快递)签收
                                            </li>
                                            <li>
                                                [北京市] 在北京昌平区南口公司进行签收扫描,快件已被拍照(您
                                                的快件已签收,感谢您使用韵达快递)签收
                                            </li>
                                            <li>
                                                [北京昌平区南口公司] 在北京昌平区南口公司进行派件扫描
                                            </li>
                                            <li>
                                                [北京市] 在北京昌平区南口公司进行派件扫描;派送业务员:业务员;联系电话:17319268636
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </li>
<!--                            <li class="tdLi">订单详情</li>-->
                        </ul>
                    </td>
                    <td th:if="${itemStat.index == 0}" th:rowspan="${itemStat.size}">
<!--                        <a-button style="display: block;">确认收货</a-button>-->
<!--                        <a-button style="display: block;">取消订单</a-button>-->
<!--                        <a-button style="width: 54%;">催单</a-button>-->
                    </td>
                  </a-card>
                </tr>
              </a-card>
            </table>
        </a-card>
    </div>

    <!-- 底部 -->
    <div class="mkl_footer"
         style="background-image: url('https://img.zcool.cn/community/01431c598be9d60000002129c119f6.jpg@1280w_1l_2o_100sh.jpg')">
        <div class="sub-footer" style="background: rgba(8 ,10 ,12, 0.8);">
            <div class="container">
                <div class="mkls_footer_grid">
                    <div class="col-xs-4 mkls_footer_grid_left">
                        <h4>地址:</h4>
                        <p>贵州省贵阳市清镇市,
                            <br> 云岭东路</p>
                    </div>
                    <div class="col-xs-4 mkls_footer_grid_left">
                        <h4>联系</h4>
                        <p>
                            <span>电话 : </span>182 xxxx 8687</p>
                        <p>
                            <span>邮箱 : </span>
                            <a href="#" style="color: #1890ff;">m182xxxx8687@163.com</a>
                        </p>
                    </div>
                    <div class="col-xs-4 mkls_footer_grid_left">
                        <h4>营业时间:</h4>
                        <p>全天候</p>
                        <p>每周五维护
                            <span>(数据服务)</span>
                        </p>
                    </div>
                    <div class="clearfix"></div>
                </div>
            </div>
        </div>
        <div class="footer-copy-right">
            <div class="container">
                <div class="allah-copy">
                    <p>Copyright &copy; 2021.书山 <a href="http://shushan.com" target="_blank"></a></p>
                </div>
                <div class="footercopy-social">
                    <ul>
                        <li>
                            <a href="#">
                                <span class="fa fa-facebook"></span>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <span class="fa fa-twitter"></span>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <span class="fa fa-rss"></span>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <span class="fa fa-vk"></span>
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
    <!-- 底部锚点 -->
    <div>
        <a-back-top></a-back-top>
    </div>
    <!-- 返回详情按钮 -->
    <div style="position:fixed; top: 5px; right: 5px;">
        <a-affix :offset-top="top">
            <a-button th:href="'http://shushan.com/'" type="primary">
                返回主页
            </a-button>
        </a-affix>
    </div>
</div>

<script>
    new Vue({
        el: '#app',
        data() {
            return {
                keywordInput: "",
                top: 50,
            }
        },
        methods: {
            onSearch() {
                // window.location.href="http://search.shushan.com/list.html?keyword="+keyword;
                location.href = "http://search.shushan.com/list.html?keyword=" + this.keywordInput
                // console.log('搜索值',value);
            },
            cart() {
                window.location.href = "http://cart.shushan.com/cart.html";
            },
        }
    })
</script>
</body>
</html>